<template>
  <view class="setting">
    <view
      @click="changeShopStatus"
      :style="{ color: vuex_user.open_status == 1 ? 'red' : '#666666' }"
    >
      <view class="iconfont icon-shouye-yingyezhong icon"> </view>
      <view>{{ vuex_user.open_status == 1 ? "营业中" : "休息中" }} </view>
    </view>
    <u-input
      v-model="announcement"
      type="textarea"
      placeholder="请输入店铺公告"
      :height="400"
      :maxlength="500"
      :border="true"
    />
    <view class="save" @click="$u.throttle(shopSeytingApi, 1000)"> 保存</view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      announcement: "店铺公告",
    };
  },
  methods: {
    /**
     * 店铺设置
     */
    shopSeytingApi() {
      var from = {
        open_status: this.vuex_user.open_status,
        announcement: this.announcement,
      };
      this.$u.api.shopSeytingApi(from).then((res) => {
        this.$u.toast("设置成功");
        uni.switchTab({
          url: "/pages/index/index",
        });
      });
    },

    shopSeytingStatus() {
      var from = {
        open_status: this.vuex_user.open_status,
        announcement: this.announcement,
      };
      if (this.announcement === "" || this.announcement === null) {
        this.$u.toast("请先设置公告.....");
        return;
      }
      this.$u.api.shopSeytingApi(from).then((res) => {
        this.$u.toast("设置成功");
      });
    },

    /**
     * 店铺状态改变
     */
    changeShopStatus() {
      if (this.vuex_user.open_status === 2) {
        var user_info = this.vuex_user;
        this.vuex_user.open_status = 1;
        this.vuex_user.announcement = this.announcement;
        this.$u.vuex("vuex_user", user_info);
      } else {
        var user_info = this.vuex_user;
        this.vuex_user.open_status = 2;
        this.vuex_user.announcement = this.announcement;
        this.$u.vuex("vuex_user", user_info);
      }
      this.shopSeytingStatus();
    },
  },
  onShow() {
    this.announcement = this.vuex_user.announcement;
  },
};
</script>

<style scoped lang ='scss' >
.setting {
  background-color: #f7f7f7;
  min-height: 100vh;
  & > view:nth-child(1) {
    text-align: center;
    padding: 200rpx;
  }
  .icon {
    font-size: 140rpx;
  }

  .save {
    height: 100rpx;
    line-height: 100rpx;
    color: #ffffff;
    background-color: #d65c45;
    width: 100vw;
    text-align: center;
    position: fixed;
    bottom: 0;
  }
}
</style>
